<template>
	<div class="vue-box">
		<div class="c-panel">
			<!-- 参数栏 -->
			<div class="c-title" align="center"><h3>用户列表</h3></div>
			<el-form :inline="true" size="mini">
				<el-form-item label="用户昵称：">
					<el-input v-model="uname" placeholder="模糊查询"></el-input>
				</el-form-item>
				<el-form-item style="min-width: 0px;">
					<el-button type="primary" icon="el-icon-search" @click="pageNum = 0; f5()">查询</el-button>
				</el-form-item>
				<br />
			</el-form>
			<el-table :data="dataList" size="mini">
				<el-table-column label="编号" prop="uid" width="70px" > </el-table-column>
				<el-table-column label="用户名" prop="uname" width="200px"></el-table-column>
				<el-table-column label="状态">
					<template slot-scope="s">
						<el-switch v-model="s.row.isdelete" :active-value="false" :inactive-value="true" inactive-color="#ff4949" @change="update(s.row.isdelete,s.row.uid,1)"></el-switch>
						<b style="color: green; margin-left: 10px;" v-if="s.row.isdelete == false">正常</b>
						<b style="color: red; margin-left: 10px;" v-if="s.row.isdelete == true">禁用</b>
					</template>
				</el-table-column>
				<el-table-column prop="address" label="操作">
					<template slot-scope="s">
						<el-button class="c-btn" type="danger" icon="el-icon-delete" @click="update(false,s.row.uid)">删除</el-button>
					</template>
				</el-table-column>
			</el-table>
			<!-- 分页 -->
			<div class="page-box">
				<el-pagination background
					layout="total, prev, pager, next, sizes, jumper"
					:current-page.sync="pageNum"
					:page-size.sync="pageSize"
					:total="total"
					:page-sizes="[1, 10, 20, 30, 40, 50, 100]"
					@current-change="f5()"
					@size-change="f5()">
				</el-pagination>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
        uname : null,
        pageNum : 0,
        pageSize : 1,
        total : null,
				p: {	// 查询参数
					username: '',
					create_type: 0,
					sort_type: 1,
					start_time: new Date().getFullYear() + '-' + (new Date().getMonth() + 1) + '-1',	// 本月一号
					end_time: new Date().getFullYear() + '-' + (new Date().getMonth() + 1) + '-' + new Date().getDate(),	// 本月当日
					pageNo: 1,
					pageSize: 10,
				},
				dataCount: 1422,
				dataList: []
			}
		},
		methods: {
			// 数据刷新
			f5: function() {
         let the = this
        this.sa.ajax('/login/getUserList',
            {'uname' : this.uname, 'pageNum' : this.pageNum, 'pageSize' : this.pageSize},
            function (res) {
              the.dataList = res.data.list
              the.total = res.data.total
              the.pageNum = res.data.pageNum
              the.pageSize = res.data.pageSize
            }.bind(this),
            {type : 'get'}
        )
			},
      //删除用户数据
      update : function (data,uid,i) {
        if(i == 1) {
          this.sa.ajax('/login/deleteUser?id='+uid+'&flag='+data,
              null,
                function () {
              }.bind(this),
              {type : 'delete'}
          )
        }
        this.sa.confirm('是否删除，此操作不可撤销', function() {
          this.sa.ajax('/login/deleteUser?id='+uid+'&flag='+true,
              null,
              function () {
            this.f5()
              }.bind(this),
              {type : 'delete'}
          )
        }.bind(this))
        }
		},
		created: function(){
			this.f5();
		}
	}
</script>

<style>
</style>
